<template>
  <div class="Xifa-Page">
    <div class="alert alert-success" v-if="date" style="width:100%;margin: auto">{{date}}<span class="close" @click="date=''">&times;</span></div>
    <div class="cz">
      <div>
        <div :gutter="0" :body-style="{ padding: '0px' }" v-for="item in items">
          <el-col :span="12">
            <div  class="xifa-img">
              <img :src="item.img" class="xifa-image">
            </div>
          </el-col>
          <el-col :span="12">
            <div  class="xifa-img">
              <div style="padding: 5px; float: left;padding-left: 10px">
                <span>立即购买享优惠</span>
                <br>
                <span>品牌:{{item.name}}</span>
                <br>
                <span>价格:{{item.jiage}}</span>
                <div class="bottom clearfix">
                  <!--<time class="time">{{ currentDate }}</time>-->
                  <el-button type="text" class="button">立即购买</el-button>
                  <el-button type="text" class="button"  @click="Houtai()"><router-link :to="{path:'/yawang/'+item.id}" style="color:red;margin-right:5px;">加入购物车</router-link></el-button>
                </div>
              </div>
              <div style="clear: both"></div>
            </div>
          </el-col>
        </div>

      </div>
    </div>
  </div>
</template>
<script>
export default {
name: 'YaWang-Page',
data() {
return {
items: {},
date: ""
}
},
computed: {},
mounted() {
  this.$http.get('/xifa/' + this.$route.params.id).then(resp => {
  //        console.log(localStorage.id);
     this.items = resp.data;
  //            for(let sp of resp.data[1]){
  //               this.shops = sp.picture;
  //            }
  }).catch(err => console.log(err));
  },

methods: {
Houtai(){
  this.$http.get('/tianjia/'+this.$route.params.id)
  .then(resp => {
    let a = resp.data[1];
    let b = a[0];
    let c = b.xifen_id;
//    console.log(b.xifen_id);
      this.date = resp.data[0];

    this.$router.push("/yawang/"+c);
//    this.$route.params.id = 7;
    })
  },
  }
}
</script>
<style lang="less">
  .Xifa-Page {
    width: 100%;height: 100%;
    overflow-x: hidden;overflow-y: hidden;
  }
  .xifa-img {
    height: 104px;margin-bottom: 2px;
    font-weight: bolder;background: linear-gradient(white,snow,whitesmoke);
  }
  .xifa-image{
    width: 100%;height: 104px;
  }
  .cz{width: 100%;margin: auto;margin-bottom: 52px}

</style>
